@charset "utf-8";

/**───────────────────────────────────────────────────────────────────
主颜色
 ─────────────────────────────────────────────────────────────────────*/
@mixin color () {color:$theme-color-light;
  [data-theme="light"] & {color:$theme-color-light !important;}
  [data-theme="night"] & {color:$theme-color-night-dark !important;}
  @include transition_color();
}
@mixin color_3 () {color:$theme-color-light_3;
  [data-theme="light"] & {color:$theme-color-light_3;}
  [data-theme="night"] & {color:$theme-color-night-dark-3;}
  @include transition_color();
}


/**───────────────────────────────────────────────────────────────────
背景颜色
 ─────────────────────────────────────────────────────────────────────*/
@mixin bg_color {
  background-color:$theme-bg-color-light;
  [data-theme="light"] & {background-color:$theme-bg-color-light}
  [data-theme="night"] & {background-color:$theme-bg-color-night;}
  transition: background-color 0.1s;
  @include transition_bg_color();
}
@mixin bg_color_3 {
  background-color:$theme-bg-color-light-3;
  [data-theme="light"] & {background-color:$theme-bg-color-light-3;}
  [data-theme="night"] & {background-color:$theme-bg-color-night-3;}
  @include transition_bg_color();
}


@mixin bg_color_left {background-color:#f5f5f5;
  [data-theme="light"] & {background-color: #f5f5f5}
  [data-theme="night"] & {background-color: #403e44;}
  @include transition_bg_color();
}

/**───────────────────────────────────────────────────────────────────
边框颜色
 ─────────────────────────────────────────────────────────────────────*/
@mixin b_color {
  border-color:$theme-color-light;
  [data-theme="light"] & {border-color:$theme-color-light !important;}
  [data-theme="night"] & {border-color:$theme-color-night-dark !important;}
}


@mixin transition_color {
  transition: color 0.1s;
}
@mixin transition_bg_color {
  transition: background-color 0.1s;
}

